<HTML>
<HEAD>
	<TITLE></TITLE>

	<link rel="stylesheet" type="text/css" href="/static/css/main.css"/>
	<script type="text/javascript" src="/scripts/js/main.js"></script>
	<script type="text/javascript" src="/scripts/js/jaction/Util.js"></script>
	<script type="text/javascript" src="/scripts/js/jaction/Ajax.js"></script>
</HEAD>

<BODY>

<script type="text/javascript">
</script>

<div id="container" class="subpage">

<div id="header">
	<a id="logo" accesskey="1" title="Grunter / Home" href="/">
		<img width="125" height="42" src="/static/images/grunter.png" alt="Grunter"/>
	</a>
	<ul class="top-navigation round">
		<li><a id="home_link"        accesskey="h" href="/">Home</a></li>
		<li><a id="profile_link"     accesskey="p" href="/profile">Profile</a></li>
		<li><a id="find_people_link" accesskey="=" href="find">Find People</a></li>
		<li><a id="settings_link"    accesskey="s" href="/settings">Settings</a></li>
		<li><a id="help_link"        accesskey="?" href="/help">Help</a></li>
		<li>
			{% if user %}
				<a id="sign" accesskey="s" href="{{ logoutUrl }}">Sign out</a>
			{% else %}
				<a id="sign" accesskey="s" href="{{ loginUrl }}">Sign in</a>
			{% endif %}
		</li>
	</ul>
</div>

</div>

<div id="main" class="wrapper" style="width:450px;margin:auto">

<div style="font-weight:800;font-size:x-large;margin-right:200px;">Wuddya say?</div>

{% if user %}
<applet 
	ID="soundApplet"
	CODE="org.chatty.applet.RecordingApplet.class"
	WIDTH="450" 
	HEIGHT="80" 
	ARCHIVE="/static/java/record/commons-codec-1.3.jar,/static/java/record/recorder-1.0.0-SNAPSHOT.jar"
	NAME="RecordingApplet" 
	MAYSCRIPT
>
	<param name="postURL"    value="{{ here }}"/>
	<param name="refreshURL" value="{{ here }}"/>
	<param name="encode"     value="{{ encode }}"/>
	<param name="scriptable" value="true" />
</applet>

{% if error %} 
<div style="color:red">{{ error }}</div>
{% endif %}
{% endif %}

<table cellspacing="0" class="columns">
<tbody>
	<tr>
		<td id="content" class="round-left column">
			<div class="wrapper">


				<div class="section">
					<div id="timeline_heading">
						<h1 id="heading">Grunts</h1>

						<ul id="dm_tabs" class="tabMenu">
							<li id="inbox_tab"><a href="/inbox" class="in-page-link">Inbox</a></li>

							<li id="sent_tab"><a href="/sent" class= "in-page-link">Sent</a></li>
						</ul>
					</div>

					<div id="results_update" class="minor-notification" style= "display: none;">
						<span id="new_results_count">0</span> 
						more result since you started searching. 
						<a href="/search?q=" title="" id= "search_refresh_link" name="search_refresh_link">Refresh</a>
						to see them.
					</div>

					<ol class="statuses" id="timeline">
{% for clip in clips %}

<li class="hentry u-brianin3d mine status latest-status" id= "status_3710423983">
	<div class="listable">
		<span class="thumb vcard author">
				<img 
					src="/static/images/easter.png"
					onclick="Main.play( '/data?key={{ clip.key }}' )"
				>
		</span>
	</div>
	<span class="status-body">
		<strong>
			<a href="/users/{{ clip.username }}" class="screen-name" title="{{ clip.username }}">{{ clip.username }}</a>
			</strong>
		<span class="entry-content">
			{{ clip.comment}}
		</span>
		<span class="meta entry-meta">
			<a href="/users/{{ clip.username }}/status/{{ clip.date|date:"u" }}" class="entry-date" rel="bookmark"><span class="published">
				{{ clip.date|date:"D M j Y @ f A" }}
			</span></a>
		</span>
	</span>

	<div>
		<span class="actions">
			<a class="fav-action non-fav" id="status_star_3710423983" title="favorite this grunt" name="status_star_3710423983">
				&nbsp;&nbsp;
			</a>
			<a class= "del" title="delete this grunt">&nbsp;&nbsp;</a>
		</span>
	</div>
</li>
{% endfor %}
		</ol>
	</div>


</div>

			</div>
		</td>
	</tr>
</tbody>
</table>

<div id="pbAppletDiv" style="width:1px;height:1px">
</div>

</BODY>
</HTML>
